<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style>
			*{
				margin: 0;
				padding: 0;
			}
			ul li{
				list-style: none;
			}
			
			.tab {
				
				height: 40px;
				margin: 30px auto;
			}
			
			.tab ul li{
				width: 100px;
				text-align: center;
				border-radius: 5px;
				float: left;
				line-height: 40px;
				margin-left: 20px;
				background-color: pink;
			}
			
			.tab>div{
				width: 580px;
				height: 500px;
				border: 2px solid #000000;
				
			}
			.tab>div>div{
				width: 580px;
				height: 500px;
			}
			
			
		</style>
	<body>
		<div class="tab">
			<ul>
				<li>items1</li>
				<li>items2</li>
				<li>items3</li>
				<li>items4</li>
				<li>items5</li>
			</ul>
			<div>
				<div>content1</div>
				<div>content2</div>
				<div>content3</div>
				<div>content4</div>
				<div>content5</div>
			</div>
		</div>
		
		<script src = "../lib/jquery-3.1.1.js"></script>
		<script>
			!function(window,document,$,undefined){
				
			}(window,document,jQuery)
		</script>
	</body>
</html>
